<script setup>

import crmTypeModel from "@/views/crm/model/crmTypeModel.js";
import {filedGetFieldAPI} from "@/api/crm/common.js";
import {useSzCustomFields} from "@/views/crm/hooks/create/useSzCustomFields.js";
import SearchField from "@/views/scrm/component/search/SearchField.vue";
import WkField from "components/NewCom/WkForm/WkField.vue";

const props = defineProps({
  // fieldList: {
  //   type: Array
  // }
})

const optionData = reactive({
  fieldList: {
    type: Array
  },
  ignoreFields: ['status', 'remark', 'mapAddress'],
})

const emits = defineEmits(['refreshChange', 'searchChange', 'searchReset'])

function searchChange() {
  emits('searchChange')
}


// 和create的一样，拿到表单的参数
function getField() {
  console.log("getField", getField)
  const params = {
    label: crmTypeModel.customer
  }

  filedGetFieldAPI(params).then(res => {
    const list = res.data.data || []
    console.log("getField", list)

    const baseFields = []
    list.forEach(children => {
      const fields = []
      children.forEach(item => {
        baseFields.push(item)
      })
    })

    optionData.fieldList = baseFields
    console.log("optionData", optionData)
  }).catch((error) => {
    console.log("数据获取错误", error)
  })
}


onMounted(() => {
  getField();
})

</script>

<template>
  <div style="display: flex;flex-wrap: wrap;margin-top: 10px;margin-bottom: 10px">
    <span style="margin-top: 5px">字段搜索：&nbsp;</span>
    <!--    optionData.fieldList：{{optionData.fieldList}}-->
    <template v-for="(item, index) in optionData.fieldList" :key="index">
      <template v-if="!optionData.ignoreFields.includes(item.fieldName)">
        <span style="margin-top: 5px;width: auto">{{ item.name }} :</span>
        <search-field style="width: 100px" :item="item" :index="index"
                      v-model:field-from="optionData.fieldList">
        </search-field>
      </template>
    </template>
    <el-button type="primary" @click="searchChange">搜索</el-button>
  </div>


</template>

<style scoped lang="scss">

</style>